<template>
    <div style="background: #111214;color:#fff; width: 100%;min-height: 100vh;">
      <native :title="title"></native>
      <div class="safety-home">
        <div class="safety-line" @click="setPassword('/setPassword/0')">
          <span>登录密码</span>
          <img style="float: right;margin-top: -2px;" src="../assets/img/list-icon-more.svg" alt="">
          <span style="float: right;color: #fff;">修改</span>
        </div>
        <div class="safety-line" @click="setPassword('/setPassword/1')">
          <span>交易密码</span>
          <img style="float: right;margin-top: -2px;" src="../assets/img/list-icon-more.svg" alt="">
          <span style="float: right;color: #fff;" v-if="exchangePwd">修改</span>
          <span style="float: right;color: #fff;" v-else>设置</span>
        </div>
        <div class="safety-line">
          <span>身份认证</span>
          <img v-if="cardState == 1" @click="setPassword('/identityAuthentication')" style="float: right;margin-top: -2px;" src="../assets/img/list-icon-more.svg" alt="">
          <span style="float: right;color: #fff;margin-right: 26px;" v-if="cardState == 2">已认证</span>
          <span @click="setPassword('/identityAuthentication')" style="float: right;color: #fff;" v-if="cardState == 1">未认证</span>
        </div>
      </div>
    </div>

  </template>

  <script>
  import native from './public/native.vue'
  export default {
    name: 'safetyCenter',
    data () {
      return {
        title:'安全中心',
        cardState:'',
        exchangePwd:''
      }
    },  
    components:{
      native
    },
    computed: {
      
    },
    mounted() {
      this.initData();
    },
    methods: {
      initData(){
        this.$http.get(this.utils.config+"/gz/member/person_center").then((data)=>{
          if(data.data.success){
            this.cardState = data.data.data.cardState;
            this.exchangePwd = data.data.data.exchangePwd;
            localStorage.setItem('cardState',data.data.data.cardState);
            localStorage.setItem('exchangePwd',data.data.data.exchangePwd);
          }
        })
      },
      setPassword(num){
        this.$router.push(num)
      }
    },
  }
  </script>

  <!-- Add "scoped" attribute to limit CSS to this component only -->
  <style lang="less" scoped>
    .safety-home{
      padding:0px 15px;
    }
    .safety-line{
      padding: 22px 0px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      font-size: 16px;
      color: rgba(255, 255, 255, 0.5);
    }
  </style>
